<!DOCTYPE html>
<style>
#box {
  width: 90px;
  height: 90px;
  background-color: green;
  filter: drop-shadow(250px 50px 10px red);
}
#positioned {
  position: absolute;
  top: 100px;
  left: 100px;
  width: 50px;
  height: 50px;
  background-color: blue;
}
</style>
<!--
Tests paint invalidation of positioned object when its ancestor changes filter.
Passes if the all drop shadows change to green.
-->
<div id="box">
  <div id="positioned"></div>
</div>
<script src="../resources/text-based-repaint.js"></script>
<script>
function repaintTest() {
  box.style.filter = 'drop-shadow(300px 100px 10px green)';
}
runRepaintAndPixelTest();
</script>
